<template>
  <view class="page">
    <view class="footer">
      <up-tabbar
        :value="value1"
        @change="change1"
        :fixed="false"
        :placeholder="false"
        :safeAreaInsetBottom="false"
      >
        <up-tabbar-item
          text="首页"
          icon="home"
          @click="click1"
        ></up-tabbar-item>
        <up-tabbar-item
          text="放映厅"
          icon="photo"
          @click="click1"
        ></up-tabbar-item>
        <up-tabbar-item
          text="直播"
          icon="play-right"
          @click="click1"
        ></up-tabbar-item>
        <up-tabbar-item
          text="我的"
          icon="account"
          @click="click1"
        ></up-tabbar-item>
      </up-tabbar>
    </view>
  </view>
</template>

<script setup lang="ts">
import { ref } from "vue";
const value1 = ref(0);
function change1(e) {
  console.log(e);
}
function click1(e) {
  console.log(e);
}
</script>

<style lang="scss" scoped>
.footer {
  width: 100%;
  position: fixed;
  bottom: 0;
  z-index: 999;
}
</style>
